<template>
    <div class="CustomNode-comp flex">
       <div class="left flex align-center justify-center">
        <img :src="props.img" alt="">
       </div>
       <div class="right font-md flex align-center pl-2 text-white">
           {{props.text}}
       </div>
    </div>
</template>

<script setup lang="ts">
import { ref, onMounted, inject } from 'vue'
import TextImg from '../../../assets/text.png'
const props = defineProps({

   img:{
    type:String,
    default:TextImg
   },
   text:{
    type:String,
    default:'文本'
   }
})
 

const getNode = inject('getNode')


onMounted(() => {
    const node = getNode()
    console.log('node::: ', node);
    console.log(node)
})
</script>

<style lang="less" scoped>
.CustomNode-comp{
    color: #000;
    width: 146px;
    border-radius: 4px;
    height: 42px;
    border: 5px solid #c3ced9;
    .left{
        
        background-color: #f75606;
 
        img{
            padding: 0px 4px;
            width: 28px;
            height: 28px;
        }
    }
    .right{
        width: 100px;
        background-color: #3d424d;
        flex-shrink: 0;

    }

}

</style>